import { useAccess } from '@umijs/max';
import { Button } from 'antd';
import { ButtonProps } from 'antd/es/button';
import React, { PropsWithChildren } from 'react';

interface PermissionButtonProps extends ButtonProps {
  permissionsRequired?: string[];
}

/** 需要检查权限的按钮 */
const PermissionButton: React.FC<PropsWithChildren<PermissionButtonProps>> = (
  props,
) => {
  const { permissionsRequired, children, ...buttonProps } = props;

  const access = useAccess();

  if (!access.hasPermission(permissionsRequired)) {
    // 没有权限的情况下不显示
    return <></>;
  }
  return <Button {...buttonProps}>{children}</Button>;
};

export default PermissionButton;
